<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>Document</title>
</head>
<body>
    <div class='upImg'></div>
 
</body>
<style>
    .upImg {
  background-image: url(2.jpg);
  /* position: fixed; */
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  z-index: 11;
  width: 6.5625%;
  height: 0;
  padding-bottom: 4.063%;
  /* left: 50%; */
  -webkit-transform: translate(-50%, 0);
  -ms-transform: translate(-50%, 0);
  transform: translate(-50%, 0);
  /* bottom: 42px; */
  /* infinite 无限次播放 */
  -webkit-animation: upDown_anim 2s ease-in-out infinite;
          animation: upDown_anim 2s ease-in-out infinite;
}
@-webkit-keyframes upDown_anim {
  0%,
  100% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
  }
  50% {
    -webkit-transform: translate(0, 20px);
            transform: translate(0, 20px);
  }
}
/* @keyframes upDown_anim {
  0%,
  100% {
    -webkit-transform: translate(0, 0);
            transform: translate(0, 0);
  }
  50% {
    -webkit-transform: translate(0, 20px);
            transform: translate(0, 20px);
  }
} */
</style>
</html>